<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="./Style/skin.css" />
    <script language="javascript">
    	function checkUserN(){
    		var uerNObj=document.getElementById("userN");  
		    var userN=trim(uerNObj.value);
		    var msg ="   <img src='Images/true.jpg' style='width:12px'>";  
		    if(!userN)  
		        msg ="<font color='red'>用户名不能为空！</font>";
		    var span = document.getElementById("userNMsg");  
		    span.innerHTML = msg;  
		    return msg == "   <img src='Images/true.jpg' style='width:12px'>";
    	}	
    
		function checkUserP(){  
		    var uerPObj=document.getElementById("userP");  
		    var userP=trim(uerPObj.value);  
		    var userPRegex= /^\w{6,12}$/;  
		    var msg ="   <img src='Images/true.jpg' style='width:12px'>";  
		    if(!userP)  
		        msg ="<font color='red'>密码不能为空！</font>";  
		    else if(!userPRegex.test(userP))  
		        msg ="<font color='red'>密码长度不对！</font>";  
		    var span = document.getElementById("userPMsg");  
		    span.innerHTML = msg;  
		    return msg == "   <img src='Images/true.jpg' style='width:12px'>";  
		    } 
		
		function checkUserP2(){  
		    var uerP2Obj=document.getElementById("userP2");  
		    var userP2=trim(uerP2Obj.value);  
		    var msg ="   <img src='Images/true.jpg' style='width:12px'>";  
		    if(!userP2)  
		        msg ="<font color='red'>密码不能为空！</font>";  
		      
		    var span = document.getElementById("userP2Msg");  
		    span.innerHTML = msg;  
		    return msg == "   <img src='Images/true.jpg' style='width:12px'>";  
		    } 
		
		function checkUserPhone(){  
		    var uerPhoneObj=document.getElementById("userPhone");  
		    var userPhone=trim(uerPhoneObj.value);  
		    var userPhoneRegex= /^[1][0-9][0-9]{9}$/;  
		    var msg ="   <img src='Images/true.jpg' style='width:12px'>";  
		    if(!userPhone)  
		        msg ="<font color='red'>手机号不能为空！</font>";  
		    else if(!userPhoneRegex.test(userPhone))  
		        msg ="<font color='red'>手机号不合法！</font>";  
		    var span = document.getElementById("userPhoneMsg");  
		    span.innerHTML = msg;  
		    return msg == "   <img src='Images/true.jpg' style='width:12px'>";  
		    }
		
		function checkUserEmail(){  
		    var uerEmailObj=document.getElementById("userEmail");  
		    var userEmail=trim(uerEmailObj.value);  
		    var userEmailRegex= /^[\w-]+@([\w-]+\.)+[a-zA-Z]{2,4}$/;  
		    var msg ="   <img src='Images/true.jpg' style='width:12px'>";  
		    if(!userEmail)  
		        msg ="<font color='red'>邮箱不能为空！</font>";  
		    else if(!userEmailRegex.test(userEmail))  
		        msg ="<font color='red'>邮箱不合法！</font>";  
		    var span = document.getElementById("userEmailMsg");  
		    span.innerHTML = msg;  
		    return msg == "   <img src='Images/true.jpg' style='width:12px'>";  
		    }
		function trim(s){  
		   return s.replace(/^\s+|\s+$/g,"");  
		}  
	</script>
</head>
    <body>
        <table width="100%" border="0" cellpadding="0" cellspacing="0">
            <!-- 头部开始 -->
            <tr>
                <td width="17" valign="top" background="./Images/mail_left_bg.gif">
                    <img src="./Images/left_top_right.gif" width="17" height="29" />
                </td>
                <td valign="top" background="./Images/content_bg.gif">
                    <table width="100%" height="31" border="0" cellpadding="0" cellspacing="0" background="././Images/content_bg.gif">
                        <tr><td height="31"><div class="title">添加会员</div></td></tr>
                    </table>
                </td>
                <td width="16" valign="top" background="./Images/mail_right_bg.gif"><img src="./Images/nav_right_bg.gif" width="16" height="29" /></td>
            </tr>
            <!-- 中间部分开始 -->
            <tr>
                <!--第一行左边框-->
                <td valign="middle" background="./Images/mail_left_bg.gif">&nbsp;</td>
                <!--第一行中间内容-->
                <td valign="top" bgcolor="#F7F8F9">
                    <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
                        <!-- 空白行-->
                        <tr><td colspan="2" valign="top">&nbsp;</td><td>&nbsp;</td><td valign="top">&nbsp;</td></tr>
                        <tr>
                            <td colspan="4">
                                <table>
                                    <tr>
                                        <td width="100" align="center"><img src="./Images/mime.gif" /></td>
                                        <td valign="bottom"><h3 style="letter-spacing:1px;">请根据表格内容及要求准确填写信息！</h3></td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                        <!-- 一条线 -->
                        <tr>
                            <td height="40" colspan="4">
                                <table width="100%" height="1" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
                                    <tr><td></td></tr>
                                </table>
                            </td>
                        </tr>
                        <!-- 添加栏目开始 -->
                        <tr>
                            <td width="2%">&nbsp;</td>
                            <td width="96%">
                                <table width="100%">
                                    <tr>
                                        <td colspan="2">
                                            <form action="./insertUser" method="post">
                                                <table width="100%" class="cont">
                                                    <tr>
                                                        <td width="2%">&nbsp;</td>
                                                        <td width="10%">用户名：</td>
                                                        <td width="20%"><input class="text" type="text" name="userName" id="userN" onblur="checkUserN()"/></td>
                                                        <td><span id="userNMsg" style=" color:#F00">*请输入用户名</span></td>
                                                        <td width="2%">&nbsp;</td>
                                                    </tr>
                                                    <tr>
                                                        <td width="2%">&nbsp;</td>
                                                        <td>密码：</td>
                                                        <td><input class="text" type="password" name="password" id="userP" onblur="checkUserP()" /></td>
                                                        <td><span id="userPMsg" style=" color:#F00">*密码长度6-12位</span></td>
                                                        <td width="2%">&nbsp;</td>
                                                    </tr>
                                                    <tr>
                                                        <td width="2%">&nbsp;</td>
                                                        <td>确认密码：</td>
                                                        <td><input class="text" type="password" name="repassword" id="userP2" onblur="checkUserP2()"/></td>
                                                        <td><span id="userP2Msg" style=" color:#F00">*两次密码必须一致</span></td>
                                                        <td width="2%">&nbsp;</td>
                                                    </tr>
                                                    <tr>
                                                        <td width="2%">&nbsp;</td>
                                                        <td>手机号：</td>
                                                        <td><input class="text" type="text" name="phone" id="userPhone" onblur="checkUserPhone()"/></td>
                                                        <td><span id="userPhoneMsg" style=" color:#F00">*请输入一个合法的手机号码</span></td>
                                                        <td width="2%">&nbsp;</td>
                                                    </tr>
                                                    <tr>
                                                        <td width="2%">&nbsp;</td>
                                                        <td>电子邮箱：</td>
                                                        <td><input class="text" type="text" name="email" id="userEmail" onblur="checkUserEmail()"/></td>
                                                        <td><span id="userEmailMsg" style=" color:#F00">*请输入一个合法的邮箱地址</span></td>
                                                        <td width="2%">&nbsp;</td>
                                                    </tr>
                                                    <tr>
                                                        <td width="2%">&nbsp;</td>
                                                        <td>类型：</td>
                                                        <td>
                                                            <input type="radio" name="power" value="1" /> 管理员 
                                                            <input type="radio" name="power" value="0" /> 普通用户
                                                        </td>
                                                        <td></td>
                                                        <td width="2%">&nbsp;</td>
                                                    </tr>
                                                    <tr>
                                                        <td>&nbsp;</td>
                                                        <td colspan="3"><input class="btn" type="submit" value="提交" /></td>
                                                        <td>&nbsp;</td>
                                                    </tr>
                                                </table>
                                            </form>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                            <td width="2%">&nbsp;</td>
                        </tr>
                        <!-- 添加栏目结束 -->
                        <tr>
                            <td height="40" colspan="4">
                                <table width="100%" height="1" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
                                    <tr><td></td></tr>
                                </table>
                            </td>
                        </tr>
                        <tr>
                            <td width="2%">&nbsp;</td>
                            <td width="51%" class="left_txt">
                                <img src="./Images/icon_mail.gif" width="16" height="11"> 客户服务邮箱：rainman@foxmail.com<br />
                                <img src="./Images/icon_phone.gif" width="17" height="14"> 官方网站：<a href="http://www.rain-man.cn">http://www.rain-man.cn</a>
                            </td>
                            <td>&nbsp;</td><td>&nbsp;</td>
                        </tr>
                    </table>
                </td>
                <td background="./Images/mail_right_bg.gif">&nbsp;</td>
            </tr>
            <!-- 底部部分 -->
            <tr>
                <td valign="bottom" background="./Images/mail_left_bg.gif">
                    <img src="./Images/buttom_left.gif" width="17" height="17" />
                </td>
                <td background="./Images/buttom_bgs.gif">
                    <img src="./Images/buttom_bgs.gif" width="17" height="17">
                </td>
                <td valign="bottom" background="./Images/mail_right_bg.gif">
                    <img src="./Images/buttom_right.gif" width="16" height="17" />
                </td>           
            </tr>
        </table>
    </body>
</html>